<div class="tuleap-modal-background">
</div>
<div class="tuleap-modal tuleap-modal-pimped">
    <div class="tuleap-modal-side-panel">
        <div class="tuleap-modal-side-panel-grip">
            <span>{{ artifact_links_title }}</span>
        </div>
        <div class="tuleap-modal-side-panel-content">
            <div class="tuleap-modal-side-panel-content-title">
                <h3>{{ artifact_links_title }}</h3>
            </div>
            <div class="tuleap-modal-side-panel-content-content">
                <div class="alert alert-info">{{{ artifact_links_readonly }}}</div>
                <ul class="tracker_artifact_links">
                {{# artifact_links }}
                    <li>
                        <a href="/goto?key={{tracker_name}}&val={{artifact_id}}&group_id={{group_id}}" class="cross-reference">#{{artifact_id}} {{title}}</a>
                    </li>
                {{/ artifact_links }}
                {{^ artifact_links }}
                    <li class="empty-state">
                        {{ no_artifact_links }}
                    </li>
                {{/ artifact_links }}
                </ul>
            </div>
            <div class="tuleap-modal-side-panel-content-actions">
            </div>
        </div>
    </div>

    <div class="tuleap-modal-main-panel">
        <form enctype="multipart/form-data">
            <div class="tuleap-modal-title">
                <i class="icon-remove tuleap-modal-close"></i>
                <h3>{{ artifact_title }}</h3>
            </div>
            <div class="tuleap-modal-content">
                <div id="artifact-form-errors" class="alert alert-error">
                    <h5></h5>
                    <ul></ul>
                </div>
                <div>
                    <table cellspacing="0" cellpadding="0" border="0">
                        <tr valign="top">
                            <td>
                                {{{ form_elements }}}
                            </td>
                        </tr>
                    </table>
                </div>
                <input type="hidden" id="artifact_informations"
                       data-artifact-id="{{ artifact_id }}"
                       data-changeset-id="{{ last_changeset_id }}"/>
                <input type="hidden" name="from_overlay" value="1">
            {{{ javascript_rules }}}
            </div>
            <div class="tuleap-modal-actions">
                <textarea id="tracker_followup_comment_new"  class="user-mention" name="artifact_followup_comment" placeholder="{{ add_followup_placeholder }}"></textarea>
                <div>
                    {{# user_is_logged_in }}
                        <input type="submit" id="tuleap-modal-submit" class="btn btn-primary" data-normal-text="{{ submit }}" data-loading-text="{{ submit }}..." value="{{ submit }}">
                    {{/ user_is_logged_in }}
                    <a class="btn tuleap-modal-close">{{ cancel }}</a>
                </div>
            </div>
        </form>
    </div>

    <div class="tuleap-modal-side-panel">
        <div class="tuleap-modal-side-panel-grip">
            <span>{{ followups_title }}</span>
        </div>
        <div class="tuleap-modal-side-panel-content">
            <div class="tuleap-modal-side-panel-content-title">
                <h3>{{ followups_title }}</h3>
            </div>
            <div class="tuleap-modal-side-panel-content-content">
                {{{ follow_ups }}}
            </div>
            <div class="tuleap-modal-side-panel-content-actions">
            </div>
        </div>
    </div>
</div>
